<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:f="http://java.sun.com/jsf/core">

<h:head>
	<f:loadBundle basename="com.davivienda.oneclick.bundle.messages"
		var="msg" />
	<style type="text/css">
/* tamaño de fuente base */
.ui-widget .ui-widget {
	font-size: 11px;
}
/*tamaño de letra de los calendarios*/
#ui-datepicker-div {
	font-size: 11px !important;
}
/*tamaño de la pantalla*/
.panel {
	border: none !important;
	width: 1024px !important;
}
/*color de letra datatables*/
.ui-resizable-column {
	color: #000000 !important;
}
/*bordes de los botones*/
.ui-corner-all {
	border-radius: 0px;
}

/*estilo botones*/
.ui-button-text-only {
	border: 1px solid #7f1613 !important;
	background: #b20000 !important;
	color: #ffffff !important;
	padding: 0px;
	margin: 0px;
	border-spacing: 0px;
}
/*colores barra del paginador*/
.ui-paginator-bottom {
	border: none !important;
	color: #0000FF !important;
	background: white !important;
}
/*titulo de panel*/
.ui-panel .ui-panel-titlebar {
	border: none !important;
	color: #A81918 !important;
	font-size: 16px !important;
	background: white !important;
}
/*tamaño fuente datatable*/
.ui-datatable table {
	font-size: 11px !important;
}
/* espaciado en encabezado de datatable*/
.ui-datatable th {
	white-space: normal !important;
}
/*ubicacion de icono de sort en las datatable*/
.ui-datatable .ui-sortable-column-icon {
	position: static !important;
}
/*ubicacion de icono de sort en las datatable*/
td.sort {
	font-weight: bold !important;
	text-align: center !important;
}

/*estilos para paginador de pymes*/
.ui-paginator-first {
	border: none !important;
	background: white !important;
	color: #0000FF !important;
	text-decoration: underline !important;
}

.ui-paginator-next {
	border: none !important;
	background: white !important;
	color: #0000FF !important;
	text-decoration: underline !important;
}

.ui-paginator-prev {
	border: none !important;
	background: white !important;
	color: #0000FF !important;
	text-decoration: underline !important;
}

.ui-paginator-last {
	border: none !important;
	background: white !important;
	color: #0000FF !important;
	text-decoration: underline !important;
}

.ui-paginator-page {
	border: none !important;
	background: white !important;
	color: #0000FF !important;
	text-decoration: underline !important;
}

.ui-state-active,.ui-widget-content .ui-state-active,.ui-widget-header .ui-state-active
	{
	color: black !important;
}
/**********************************/

/*Cambio de icon para el calendario*/
.ui-icon-calendar {
	background-position: center !important;
}

.ui-icon {
	width: 16px;
	height: 16px;
	background-image:
		url("/InicialMultiabonos/faces/images/PYME_img_calendario.png")
		!important;
}
</style>
</h:head>

<h:body style="font-size:10px;">

	<h:form id="form">

		<p:panel styleClass="panel" id="panel"
			header="#{msg.consultaParametrosVentasTarjetas}"
			style="margin-bottom:10px; font-size: 15px;">
			<p:messages id="messages" />
			<p></p>

			<h:panelGrid columns="2" style="font-size: 11px;">
				<h:outputText value="#{msg.parametrosBusqueda}"
					style="color: #A81918; font-weight:bold;" />
				<h:outputText value="" />
				<h:outputLabel for="rangoFechas" value="#{msg.rangoFechas}:" />
				<h:panelGrid columns="4" style="font-size: 11px;">
					<h:outputLabel for="fechaInicio" value="#{msg.fechaDesde}:" />
					<p:calendar value="#{calendarBean.date3}" id="fechaInicio"
						showOn="button" />
					<h:outputLabel for="fechaFin" value="#{msg.fechaHasta}:" />
					<p:calendar value="#{calendarBean.date3}" id="fechaFin"
						showOn="button" />
				</h:panelGrid>
				<h:outputLabel for="tipoIdentificacion"
					value="#{msg.tipoIdentificacion}:" />
				<h:selectOneMenu id="tipoIdentificacion"
					value="#{pprBean.firstname}">
					<f:selectItem itemLabel="Select One" itemValue="" />
					<f:selectItems value="#{pprBean.cities}" />
				</h:selectOneMenu>
				<h:outputLabel for="numeroIdentificacion"
					value="#{msg.numeroIdentificacion}:" />
				<p:inputText id="numeroIdentificacion" value="#{pprBean.firstname}"
					disabled="true" />
				<h:outputLabel for="numeroClienteEmpresarial"
					value="#{msg.numeroClienteEmpresarial}:" />
				<p:inputText id="numeroClienteEmpresarial"
					value="#{pprBean.firstname}" />
				<h:outputLabel for="usuario" value="#{msg.usuario}:" />
				<h:selectOneMenu id="usuario" value="#{pprBean.firstname}">
					<f:selectItem itemLabel="Select One" itemValue="" />
					<f:selectItems value="#{pprBean.cities}" />
				</h:selectOneMenu>
				<h:outputLabel for="codigo" value="#{msg.codigoUnico}:" />
				<h:selectOneMenu id="codigo" value="#{pprBean.firstname}">
					<f:selectItem itemLabel="Select One" itemValue="" />
					<f:selectItems value="#{pprBean.cities}" />
				</h:selectOneMenu>
				<h:outputLabel for="tipoCuentaComercio"
					value="#{msg.tipoCuentaComercio}:" />
				<h:selectOneMenu id="tipoCuentaComercio"
					value="#{pprBean.firstname}">
					<f:selectItem itemLabel="Select One" itemValue="" />
					<f:selectItems value="#{pprBean.cities}" />
				</h:selectOneMenu>
				<h:outputLabel for="cuentaComercio" value="#{msg.cuentaComercio}:" />
				<h:selectOneMenu id="cuentaComercio" value="#{pprBean.firstname}">
					<f:selectItem itemLabel="Select One" itemValue="" />
					<f:selectItems value="#{pprBean.cities}" />
				</h:selectOneMenu>
				<h:outputLabel for="empresaDestino" value="#{msg.empresaDestino}:" />
				<h:selectOneMenu id="empresaDestino" value="#{pprBean.firstname}">
					<f:selectItem itemLabel="Select One" itemValue="" />
					<f:selectItems value="#{pprBean.cities}" />
				</h:selectOneMenu>
				<h:outputLabel for="productoDestino"
					value="#{msg.tipoProductoDestino}:" />
				<h:selectOneMenu id="tProductoDestino" value="#{pprBean.firstname}">
					<f:selectItem itemLabel="Select One" itemValue="" />
					<f:selectItems value="#{pprBean.cities}" />
				</h:selectOneMenu>
				<h:outputLabel for="nProductoDestino"
					value="#{msg.numeroProductoDestino}:" />
				<h:selectOneMenu id="nProductoDestino" value="#{pprBean.firstname}">
					<f:selectItem itemLabel="Select One" itemValue="" />
					<f:selectItems value="#{pprBean.cities}" />
				</h:selectOneMenu>
				<h:outputLabel for="estado" value="#{msg.estado}:" />
				<h:selectOneMenu id="estado" value="#{pprBean.firstname}">
					<f:selectItem itemLabel="Select One" itemValue="" />
					<f:selectItems value="#{pprBean.cities}" />
				</h:selectOneMenu>
				<h:outputLabel for="novedad" value="#{msg.novedad}:" />
				<h:selectOneMenu id="novedad" value="#{pprBean.firstname}">
					<f:selectItem itemLabel="Select One" itemValue="" />
					<f:selectItems value="#{pprBean.cities}" />
				</h:selectOneMenu>
				<br />
				<p:button value="#{msg.buscar}" style="font-size: 11px;"></p:button>
				<br />
			</h:panelGrid>
			<p:panel style="border:none !important;">
				<p:dataTable id="cars" var="car" resizableColumns="true"
					value="#{tableBean.datamodel}" paginator="true"
					paginatorPosition="bottom" rows="10"
					currentPageReportTemplate="#{msg.numeroRegistros} {startRecord} #{msg.a} {endRecord} #{msg.de} {totalRecords}"
					paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink}
{LastPageLink}">
					<p:column headerText="#{msg.fechaNovedad}" sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.codigoUnico}" sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.nitOrigen}" sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.clienteEmpresarial}"
						sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.franquicia}" sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.tipoCuentaComercio}"
						sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.cuentaComercio}" sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.nitDestino}" sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.tipoProductoDestino}"
						sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.numeroProductoDestino}"
						sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.tipoDispersion}" sortBy="#{car.year}">.</p:column>
					<p:column headerText="#{msg.valorDispersadoDavivienda}"
						sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.valorDispersadoCliente}"
						sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.estado}" sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.novedad}" sortBy="#{car.year}"></p:column>
					<p:column headerText="#{msg.usuario}" sortBy="#{car.year}"></p:column>
				</p:dataTable>
			</p:panel>
			<h:panelGrid columns="3">
				<h:outputLabel for="nit" value="#{msg.formatosDescarga}:"
					style="font-size: 13px;" />
				<h:selectOneMenu id="nit" value="#{pprBean.firstname}"
					style="font-size: 13px;">
					<f:selectItem itemLabel="#{msg.seleccione}" itemValue="" />
					<f:selectItems value="#{pprBean.cities}" />
				</h:selectOneMenu>
				<p:button value="#{msg.descargar}" style="font-size: 11px;"></p:button>
			</h:panelGrid>

		</p:panel>
	</h:form>

</h:body>

</html>